<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>Corners Test</title>
	<style type="text/css">
		body {
			background-color: #fff;
		}
		#bordered {
			padding: 50px;
			background: #990;
			-moz-border-radius: 20px;
			-webkit-border-radius: 20px;
			border-radius: 20px;
		}
		#cornered {
			width: 500px;
			height: 200px;
			background: #099 url(cassette.png) 30px 30px;
			color: #fff;
			text-align: center;
			vertical-align: middle;
			line-height: 200px;
			-moz-border-radius: 10px 40px 0 60px;
			-webkit-border-radius: 10px 40px 0 60px;
			border-radius: 10px 40px 0 60px;
			margin: auto;
			border: 6px solid red;
		}
		#corneredliquid {
			background: transparent url(pigeon.jpg) no-repeat 80px bottom;
			color: #fff;
			text-align: center;
			vertical-align: middle;
			line-height: 200px;
			-moz-border-radius: 10px 40px 0 60px;
			-webkit-border-radius: 10px 40px 0 60px;
			border-radius: 10px 40px 0 60px;
			margin: auto;
			border: 1px solid black;
		}
	</style>
	<script type="text/javascript" src="../src/msbr.js"></script>
	<script type="text/javascript">
		function cornered(){
			msbr('corneredliquid');
			msbr(document.getElementById('cornered'));
			msbr('bordered');
		}
	</script>
</head>
<body onload="cornered();">
	<div id="bordered">
		<div id="cornered"><a href="javascript:cornered();">Cornered!</a></div>
		<div id="corneredliquid"><a href="javascript:cornered();">Cornered!</a></div>
	</div>
</body>
</html>